<#include "../_inc/_layout.html"/> 
<#macro script>


var data={
    url:'',
    alt:''
};

function initTinymce(){
tinymce.init({
        selector: '#textarea',
        height: 500,
        language: 'zh_CN',
        menubar: false,
        automatic_uploads: true,
        paste_data_images: true,
        convert_urls: false,
        imagetools_toolbar: "rotateleft rotateright | flipv fliph | editimage imageoptions",
        imagetools_proxy: '${CPATH}/admin/tinymce/image/proxy',
        images_upload_url: '${CPATH}/admin/tinymce/image/upload',
        wordcount_countregex: /[\u4e00-\u9fa5_a-zA-Z0-9]/g,
		file_picker_callback: function(callback, value, meta) {
		 	layer.open({
			    type: 2,
			    title: '选择图片',
			    shadeClose: true,
			    shade: 0.8,
			    area: ['92%', '90%'],
			    content: '${CPATH}/admin/attachment/choose_layer',
			    end:function(){
			    	callback(data.url, {alt: data.alt});
			    }
			}); 
		 },
        plugins: [
		    "advlist autolink autosave link image imagetools lists charmap print preview hr anchor pagebreak spellchecker",
		    "searchreplace wordcount visualblocks visualchars code codesample fullscreen insertdatetime media nonbreaking",
		    "table contextmenu directionality emoticons template textcolor paste fullpage textcolor colorpicker textpattern"
		  ],
        toolbar1: '  bold italic underline strikethrough removeformat | blockquote hr table image | link  anchor unlink | alignleft aligncenter alignright alignjustify | bullist numlist  | fullscreen code   ',
        toolbar2: '  formatselect | outdent indent | forecolor backcolor  | codesample undo redo  ',
        });
}

var simplemde ;
function initMarkdownEditor(){
	 simplemde = new SimpleMDE({ element: $("#textarea")[0] });
	// simplemde.toTextArea();
}

var _editor = "${_editor!}";
if("tinymce" == _editor){
 		initTinymce();
 	}else{
 		initMarkdownEditor();
}
    
function save(){
	//simplemde.toTextArea();
	//alert(simplemde.markdown(simplemde.value()));
	//alert($("#textarea").text());
	//simplemde = null;
	
	  $('#content_slug').attr('value',$("#slug_text").text());
	
	if("tinymce" == _editor){
		tinymce.activeEditor.uploadImages(function(success) {
			tinymce.triggerSave();
	 		doSubmit();
		});
	}else{
		$("#textarea").text(simplemde.markdown(simplemde.value()));
		doSubmit();
	}
	return false;
 }
 
 function saveAsDraft(){
 	$("#content_status").attr("value","draft");
 	save();
 }
 
 function doSubmit(){
 	$("#form").ajaxSubmit({
			type : "post", 
			dataType : "json", 
			success : function(data) { 
				toastr.success('保存成功！','操作成功');
				$("#content_id").attr("value",data.data);
			},
			error : function() {
				alert("信息提交错误");
			}
	});
 }
 
function doSelectThumbnail(){
 	layer.open({
			    type: 2,
			    title: '选择图片',
			    shadeClose: true,
			    shade: 0.8,
			    area: ['92%', '90%'],
			    content: '${CPATH}/admin/attachment/choose_layer',
			    end:function(){
			    	$("#thumbnail").attr("src",data.url);
			    	$("#content_thumbnail").attr("value",data.url);
			    }
			}); 
 }
 
 function change_editer(){
 	if("tinymce" == _editor){
 		doAjax('${CPATH}/admin/content/changeEditor/markdown');
 	}else{
 		doAjax('${CPATH}/admin/content/changeEditor/tinymce');
 	}
 }
 
function doAjax(url){
	  $.get(url, function(result){
			if(result.errorCode > 0){
				alert(result.message);
			}else{
				location.reload();
			}
	  }); 
  }
 
<#if module ??> 
<#list module.taxonomyTypes! as taxonomyType > 
 $('#_${taxonomyType.name}').tagEditor();
</#list>
</#if>


$("#title").keyup(function(){
	if($('#content_slug').val() == ""){
	   $("#slug_text").text(this.value);
       $('#slug_text').editable('setValue',this.value);
	}
});

$(document).ready(function(){
	
	 $.fn.editable.defaults.mode = 'inline';
	 $('#slug_text').editable();
	 
	 var url = window.location.protocol  +"//"+ window.location.host+"${CPATH}${urlPreffix}" ;
     $("#url_preffix").text(url);
     $('#slug_text').editable('setValue'," ${(content.slug)!'标题'}");
     
     $('#titleurl').on('save', function(e, params) {
    	 $('#content_slug').attr('value',params.newValue);
	 });
});

</#macro> 
<#macro script_import>
<script src="${CPATH}/static/tinymce/tinymce.min.js"></script>
<script src="${CPATH}/static/plugins/tag/jquery.caret.min.js"></script>
<script src="${CPATH}/static/plugins/tag/jquery.tag-editor.min.js"></script>
<script src="${CPATH}/static/plugins/editable/bootstrap-editable.min.js"></script>
<script src="${CPATH}/static/simplemde/simplemde.min.js"></script>
</#macro>
<#macro css_import>
<link rel="stylesheet" href="${CPATH}/static/plugins/tag/jquery.tag-editor.css">
<link rel="stylesheet" href="${CPATH}/static/plugins/editable/bootstrap-editable.css">
<link rel="stylesheet" href="${CPATH}/static/simplemde/simplemde.min.css">
</#macro>
<#macro css>
.editable-input {
	width: 100%;
}
.form-inline .form-control {
    display: inline-block;
    width: 100%;
    vertical-align: middle;
}
</#macro>
<@layout active_id=p child_active_id=c>
<!-- Content Header (Page header) -->
<section class="content-header">
	<h1>${(module.addTitle)!}</h1>
</section>
<!-- Main content -->
<section class="content" style="z-index: 9999">
	<form action="${CPATH}/admin/content/save" id="form" method="post">
		<input type="hidden" name="content.module" value="${(content.module)!m!}"> 
		<input type="hidden" id="content_id" name="content.id" value="${(content.id)!}"> 
		<input type="hidden" name="content.status" value="normal" id="content_status"> 
		<input type="hidden" name="content.created" value="${(content.created)!}" > 
		<input type="hidden" id="content_slug" name="content.slug" value="${(content.slug)!}" > 
		<input type="hidden" name="ucode" value="${ucode}">
		<div class="row">
			<!-- /.col -->
			<div class="col-md-9">
				<div class="form-group">
					<label class="sr-only"></label> <input name="content.title" class="form-control input-lg" id="title" value="${(content.title)!}" type="text" placeholder="在此输入标题">
				</div>
					<div class="pull-right"><a href="javascript:void(0);" onclick="change_editer()">切换编辑器 </a> </div>
					<label>
					<div ${slugDisplay!} >
						网址：<span id="url_preffix"></span><span id="slug_text">${(content.slug)!}</span>${(urlSuffix)!}
					</div>
					</label>
					<div class="box box-solid">
						<div  class="box-body no-padding">
						<textarea id="textarea"  name="content.text" >${(content.text)!}</textarea>
					</div>
					</div>
				
				<div class="box box-solid">
					<div class="box-header with-border">
						<h3 class="box-title">属性设置</h3>

						<div class="box-tools">
							<button type="button" class="btn btn-box-tool" data-widget="collapse">
								<i class="fa fa-minus"></i>
							</button>
						</div>
					</div>
					<!-- /.box-header -->
					<div class="box-body no-padding">
						<!-- Custom Tabs -->
						<div class="nav-tabs-custom">
							<ul class="nav nav-tabs">
								<li class="active">
									<a href="#tab_1" data-toggle="tab">常用</a>
								</li>
								<li>
									<a href="#tab_seo" data-toggle="tab">SEO</a>
								</li>
								<li>
									<a href="#tab_comment" data-toggle="tab">评论</a>
								</li>
								<#if module.styles ??>
								<li>
									<a href="#tab_style" data-toggle="tab">样式</a>
								</li>
								</#if>
								<li>
									<a href="#tab_position" data-toggle="tab">位置</a>
								</li>
								<li>
									<a href="#tab_remarks" data-toggle="tab">备注</a>
								</li>
								<li>
									<a href="#tab_metadata" data-toggle="tab">元数据</a>
								</li>

							</ul>
							<div class="tab-content jp-aside-hg ">
								<div class="tab-pane active " id="tab_1">
								<div class="jp-prop-input">
									Flag: <input type="text" name="content.flag" value="${(content.flag)!}">
								</div>
								<div class="jp-prop-input">
									作者: <input type="text" name="username" value="${(content.username)!}">
								</div>
								</div>
								<!-- /.tab-pane -->
								<div class="tab-pane jp-prop-box" id="tab_seo">
									<div class="jp-prop-input">
										关键字: <input type="text" name="content.meta_keywords" value="${(content.meta_keywords)!}">
									</div>
									
									<div class="jp-prop-input">
										描述: 
										<input type="text" name="content.meta_description" value="${(content.meta_description)!}">
									</div>
								</div>
								
								<div class="tab-pane jp-prop-box" id="tab_comment">
									<div class="jp-prop-input">
										评论: <select name="content.comment_status">
												<option value="">默认</option>
												<#if (content.comment_status)?? && "open" == content.comment_status >
												<option value="open"  selected="selected">开启</option>
												<#else>
												<option value="open">开启</option>
												</#if>
												
												<#if (content.comment_status)?? && "close" == content.comment_status >
												<option value="close"  selected="selected">关闭</option>
												<#else>
												<option value="close">关闭</option>
												</#if>
											 </select>
									</div>
								</div>
								
								<#if module.styles ??>
								<div class="tab-pane" id="tab_style">
									<li class="jp-release-set">
										<div class="radio jp-cancel-pad">
											<label> <input type="radio" name="content.style" value=""> <i class="fa fa-envelope-o"></i>默认
											</label>
										</div>
									</li>
									<#list module.styles! as style >
									<li class="jp-release-set">
										<div class="radio jp-cancel-pad">
											<label> <input type="radio" name="content.style" value="${style}"> <i class="fa fa-envelope-o"></i>${style}
											</label>
										</div>
									</li>
									</#list>
								</div>
								</#if>
								<div class="tab-pane jp-prop-box" id="tab_position">
								<div class="jp-prop-input">
								经度: <input type="text" name="content.lng" value="${(content.lng)!}">
								</div>
								<div class="jp-prop-input">
								纬度: <input type="text" name="content.lat" value="${(content.lat)!}">
								</div>
								</div>
								<div class="tab-pane jp-prop-box" id="tab_remarks">
								<span class="jp-prop-text">备注: </span>
								<textarea rows="5"   name="content.remarks">${(content.remarks)!}</textarea>
								</div>
								<div class="tab-pane" id="tab_metadata">元数据</div>
								<!-- /.tab-pane -->
							</div>
							<!-- /.tab-content -->
						</div>
						<!-- nav-tabs-custom -->
					</div>
				</div>
			</div>
			<!-- /.col -->
			<div class="col-md-3">
			<#include "_action_box.html" /> 
			<#if module ??> 
				<#list module.taxonomyTypes! as taxonomyType > 
				<#if taxonomyType.formType == "select"> 
					<#include "_select_box.html" />
				<#else> 
					<#include "_input_box.html" /> 
				</#if> 
				</#list>
			</#if> 
			
			<#include "_thumbnail_box.html" /></div>
			<!-- /.col -->
		</div>
		<!-- /.row -->
	</form>
</section>

</@layout>






